<%--
  Created by IntelliJ IDEA.
  User: 22531
  Date: 2021/5/31
  Time: 20:09
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="/easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="/easyui/themes/icon.css">
    <script type="text/javascript" src="/easyui/jquery.min.js"></script>
    <script type="text/javascript" src="/easyui/jquery.easyui.min.js"></script>
    <script src="/easyui/locale/easyui-lang-zh_CN.js"></script>
    <script type="text/javascript" src="/js/datagrid-export.js"></script>

    <script type="text/javascript">
        $(function () {
            $('#allStuInfo').datagrid({
                url: '/admin/getAllStuInfoWithClazz',
                columns:[[
                    {field:"id",align:"center",title:'学生ID'},
                    {field:"sno",align:"center",title:'学号'},
                    {field:"name",align:"center" ,title:'姓名'},
                    {field:"password", align:"center",title:"密码"},
                    {field:"clazzName" ,width:150,align:"center",title:"班级"},
                    {field:"dept", align:"center",title:'学院'},
                    {field:"sex", align:"center",title:'性别'},
                    {field:"address",width:100 ,align:"center",title:'地址'},
                    {field:"age", align:"center",title:'年龄'},
                    {field:"phone" ,align:"center",title:'电话'},
                    {field:"dormitory", align:"center",title:'宿舍'},
                    {field:"native_place" ,align:"center",title:'籍贯'}
                ]],
                iconCls: 'icon-edit',
                title:'所有学生信息',
                singleSelect: true,
                method: 'get',
                rownumbers:true,
                pagination: true,
                pageSize:64,
                pageList:[64,100,200,300,400],
                idField:'id',
                toolbar: '#toolbar',
                queryParams: {
                    clazz_id: $('#c').val(),
                }
            })


        })
    </script>
    <script type="text/javascript">
        function toPdf(){
            var body = $('#allStuInfo').datagrid('toArray');
            var docDefinition = {
                content: [{
                    table: {
                        headerRows: 1,
                        widths: ['*','*','*','*','auto','*','*','*','*','*','*','*'],//注意要与列数对应
                        body: body
                    }
                }]
            };
            pdfMake.createPdf(docDefinition).open();
        }
    </script>
</head>
<body>



<div id="toolbar">
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload" plain="true" onclick="$('#allStuInfo').datagrid('reload')">刷新</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" plain="true">班级：</a>
    <input id="c" class="easyui-combobox" data-options="
                    url:'/admin/getAllClazz',
                    method:'get',
                    valueField:'id',
                    textField:'name',
                    panelHeight:'auto',
                    labelPosition: 'top',
                    required:true,
                    editable:false,
                    value:1,
                    ">
    <a href="javascript:;" class="easyui-linkbutton" data-options="iconCls:'icon-excel'" onclick="$('#allStuInfo').datagrid('toExcel','dg.xls')">ExportToExcel</a>
    <a href="javascript:;" class="easyui-linkbutton" data-options="iconCls:'icon-pdf'" onclick="$('#allStuInfo').datagrid('print','DataGrid')">ExportToPDF</a>
</div>
<SCRIPT type="text/javascript">
    $('#c').combobox({
        onChange: function(newValue,oldValue){
            $('#allStuInfo').datagrid('load',{
                clazz_id: $('#c').val(),
            });
        }
    });

</SCRIPT>
<div class="easyui-panel" data-options="fit:true,border:false">
    <table id="allStuInfo" ></table>
</div>
</body>
</html>
